<template>
    <component
        @timeSelect="handleTimeSelect"
        :is="currentPlanComponent"
        :timePlan="processedTimePlan"
        :isViewMonthPlan="props.isViewMonthPlan"
    />
</template>

<script lang="ts" setup>
import { computed, defineProps, ref } from 'vue-demi';

import DayPlan from './lib/DayPlan.vue';
import MonthPlan from './lib/MonthPlan.vue';
import WeekPlan from './lib/WeekPlan.vue';

const emit = defineEmits(['timeBackFill']);
const props = defineProps<{
    type: string;
    timePlan: Array<{ startDate: string; endDate?: string }>;
    isViewMonthPlan?: boolean;
}>();

// 处理 timePlan，设置默认的 endDate
const processedTimePlan = computed(() => {
    return props.timePlan.map((entry) => {
        const newEntry = { ...entry }; // 创建条目的副本以保持原始数据不变

        if (props.type === '1d' && newEntry.endDate === '') {
            newEntry.endDate = '23:59'; // 日计划时，endDate 为空则设置为 23:59
        }

        if (props.type === '7d' && newEntry.endDate === '-') {
            newEntry.endDate = '7-23:59'; // 周计划时，endDate 为空则设置为 '7-23:59'
        }

        return newEntry;
    });
});
const currentPlanComponent = computed(() => {
    if (props.type === '1d') {
        return DayPlan;
    } else if (props.type === '7d') {
        return WeekPlan;
    } else if (props.type === '1m') {
        return MonthPlan;
    }
    return null;
});
interface TimeDay {
    startTime: string;
    endTime: string;
}
const timeDay = ref<TimeDay[]>([
    {
        startTime: '',
        endTime: '',
    },
]);
//周计划
interface TimeWeekPlan {
    startDay: string;
    startTime: string;
    endDay: string;
    endTime: string;
}
const timeWeekPlan = ref<TimeWeekPlan[]>([
    {
        startDay: '',
        startTime: '',
        endDay: '',
        endTime: '',
    },
]);
//月计划
interface TimeMonthPlan {
    startDay: string;
    startTime: string;
    endDay: string;
    endTime: string;
}
const timeMonthPlan = ref<TimeMonthPlan[]>([
    {
        startDay: '',
        startTime: '',
        endDay: '',
        endTime: '',
    },
]);
const handleTimeSelect = (timePlans: Array<{ startDate: string; endDate: string }>) => {
    if (props.type === '1d' && Array.isArray(timePlans)) {
        // 更新所有时间选择
        timeDay.value = timePlans.map((plan) => ({
            startTime: plan.startDate,
            endTime: plan.endDate,
        }));
        emit('timeBackFill', timeDay.value);
    }
    if (props.type === '7d' && Array.isArray(timePlans)) {
        // 更新所有时间选择
        timeWeekPlan.value = timePlans.map((plan) => {
            const [startDay, startTime] = plan.startDate ? plan.startDate.split('-') : ['', ''];
            const [endDay, endTime] = plan.endDate ? plan.endDate.split('-') : ['', ''];
            return {
                startDay,
                startTime,
                endDay,
                endTime,
            };
        });
        emit('timeBackFill', timeWeekPlan.value);
    }
    if (props.type === '1m' && Array.isArray(timePlans)) {
        // 更新所有时间选择
        timeMonthPlan.value = timePlans.map((plan) => {
            const [startDay, startTime] = plan.startDate ? plan.startDate.split('-') : ['', ''];
            const [endDay, endTime] = plan.endDate ? plan.endDate.split('-') : ['', ''];
            return {
                startDay,
                startTime,
                endDay,
                endTime,
            };
        });
        emit('timeBackFill', timeMonthPlan.value);
    }
};
</script>
